<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>查看通知</title>
  <meta name="keywords" content="">
  <meta name="description" content="">
  <link href="../css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
  <link href="../css/font-awesome.css?v=4.4.0" rel="stylesheet">
  <link href="../css/plugins/iCheck/custom.css" rel="stylesheet">
  <link href="../css/animate.css" rel="stylesheet">
  <link href="../css/style.css?v=4.1.0" rel="stylesheet"></head>

<body class="gray-bg">
  <div class="wrapper wrapper-content">
    <div class="row">
      <div class="col-sm-12 animated fadeInRight">
        <div class="mail-box-header">
          <div class="pull-right tooltip-demo">
            <a href="mail_compose.html" class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="回复"> <i class="fa fa-reply"></i>
              回复
            </a>
            <a href="mail_detail.html#" class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="打印邮件"> <i class="fa fa-print"></i>
            </a>
            <a href="mailbox.html" class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="标为垃圾邮件">
              <i class="fa fa-trash-o"></i>
            </a>
          </div>
          <h2>查看邮件</h2>
          <div class="mail-tools tooltip-demo m-t-md">

            <h3>
              <span class="font-noraml">主题：</span>
              有一个检测任务尚未完成
            </h3>
            <h5>
              <span class="pull-right font-noraml">2016年10月28日(星期二) 晚上8:20</span>
              <span class="font-noraml">发件人：</span>
              系统通知
            </h5>
          </div>
        </div>
        <div class="mail-box">

          <div class="mail-body">
            <h4>尊敬的实验员：</h4>
            <p>
              工字钢简支梁动力荷载试验, 检测号: RD-2016101208 检测任务即将到期, 请按时完成。
            </p>

            <p class="text-right">系统通知</p>
          </div>
          <div class="mail-attachment">
            <p>
              <span>
                <i class="fa fa-paperclip"></i>
                2 个附件 -
              </span>
              <a href="mail_detail.html#">下载全部</a>
              |
              <a href="mail_detail.html#">预览全部图片</a>
            </p>

            <div class="attachment">
              <div class="file-box">
                <div class="file">
                  <a href="mail_detail.html#">
                    <span class="corner"></span>

                    <div class="icon">
                      <i class="fa fa-file"></i>
                    </div>
                    <div class="file-name">Document_2014.doc</div>
                  </a>
                </div>

              </div>
              <div class="file-box">
                <div class="file">
                  <a href="mail_detail.html#">
                    <span class="corner"></span>

                    <div class="image">
                      <img alt="image" class="img-responsive" src="../img/p1.jpg"></div>
                    <div class="file-name">Italy street.jpg</div>
                  </a>

                </div>
              </div>
              <div class="file-box">
                <div class="file">
                  <a href="mail_detail.html#">
                    <span class="corner"></span>

                    <div class="image">
                      <img alt="image" class="img-responsive" src="../img/p2.jpg"></div>
                    <div class="file-name">My feel.png</div>
                  </a>
                </div>
              </div>
              <div class="clearfix"></div>
            </div>
          </div>
          <div class="mail-body text-right tooltip-demo">
            <a class="btn btn-sm btn-white" href="mail_compose.html">
              <i class="fa fa-reply"></i>
              回复
            </a>
            <a class="btn btn-sm btn-white" href="mail_compose.html">
              <i class="fa fa-arrow-right"></i>
              下一封
            </a>
            <button title="" data-placement="top" data-toggle="tooltip" type="button" data-original-title="打印这封邮件" class="btn btn-sm btn-white">
              <i class="fa fa-print"></i>
              打印
            </button>
            <button title="" data-placement="top" data-toggle="tooltip" data-original-title="删除邮件" class="btn btn-sm btn-white">
              <i class="fa fa-trash-o"></i>
              删除
            </button>
          </div>
          <div class="clearfix"></div>

        </div>
      </div>
    </div>
  </div>

  <!-- 全局js -->
  <script src="../js/jquery.min.js?v=2.1.4"></script>
  <script src="../js/bootstrap.min.js?v=3.3.6"></script>

  <!-- 自定义js -->
  <script src="../js/content.js?v=1.0.0"></script>

  <!-- iCheck -->
  <script src="../js/plugins/iCheck/icheck.min.js"></script>
  <script>
        $(document).ready(function () {
            $('.i-checks').iCheck({
                checkboxClass: 'icheckbox_square-green',
                radioClass: 'iradio_square-green',
            });
        });
    </script>

</body>

</html>